import React from "react";
import './InputBox.css';

class InputBox extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            list: [],
        }
    }

    render() {
        return (
            <div className="bigdv">
                <h1>留言板</h1>
                <textarea ref="info"></textarea>
                <br></br>
                <img ref="imgurl" onClick={() => {
                    var img = this.refs.imgurl;
                    console.log(img)
                    // this.state.list.push(img)
                }}></img>
                <input type="file" ref="select" onChange={(event) => {
                    var reader = new FileReader();
                    reader.onload = (event) => {
                        this.refs.imgurl.src = event.target.result;
                    }
                    reader.readAsDataURL(event.target.files[0])
                }} />

                <button onClick={() => {
                    var value = this.refs.info.value
                    this.state.list.push(value)
                    this.setState({

                    })
                }}>发布</button>

                <div>
                    {
                        this.state.list.map((value) => {
                            return <p key={value}>{value}
                            {/* <img src={value.img}></img> */}
                            </p>
                        })
                    }
                </div>
            </div>
        )
    }
}

export default InputBox